<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>调查问卷</title>
    <%@include file="../../../common/includeBaseSet.jsp" %>
    <%@include file="../../../common/includeSystemSet.jsp" %>
    <%@include file="../../../common/operation_forbid.jsp" %>
    <%@include file="../../../common/jsVersion.jsp" %>
    <link rel="stylesheet" href="${jypath}/resources/css/questionnaireStyle.css">
    <style type="text/css">
        a{cursor:pointer}
    </style>
</head>
<body >
    <div class="window-tag">
       <div class="qs-item">
           <form id="baseForm">
               <input type='hidden' class='pageNum' id='pageNum' name='pageNum' value='1'/>
               <input type='hidden' class='pageSize' id='pageSize'  name='pageSize' value='9'/>
	           <div class="item-inline">
	               <span class="qs-tag">标签类别：</span>
	               <select class="qs-select  modal-select date-margin15" id="typeId">
	                   <option value="">全部</option>
	                   <c:forEach items="${tagList}" var="list">
	                       <option value="${list.id}">${list.tagName}</option>
	                   </c:forEach>
	               </select>
	           </div>
	           <div class="item-inline">
	               <span class="qs-tag">标签搜索：</span>
	               <input class="modal-input" placeholder="  输入您要搜索的标签内容" id="tagName"  onkeydown="return ClearSubmit(event)">
	           </div>
	           <div class="modal-btn">
	               <a onclick="JY.Page.jump('baseForm',1,'getCusTag')" class="qs-btn-default border40a qs-button-small">查询</a>
	               <a onclick="clearFrom()" class="qs-btn-default color999 qs-button-small">清空条件</a>
	           </div>
           </form>
           <div class="modal-box">
               <div id="baseDiv" class="modal-list font14px">
                   <!-- 标签内容 -->
               </div>
               <!--设置分页位置-->
               <div id="pageing" class="dataTables_paginate paging_bootstrap">
                   <ul class="pagination"></ul>
               </div>
           </div>
       </div>
       <div class="font12px text-center  modal-btn-box">
           <a onclick="saveTagId()" class="qs-btn-default color444">确定</a>
           <a onclick="clearCusTagId()" class="qs-btn-default color444">清空选项</a>
       </div>
	</div>
    <script type="text/javascript" src="${jypath}/static/js/system/questionnaire/questionnaire.js"></script>
</body>
<script type="text/javascript">
    var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
    
    $(function(){
    	//初始化客户标签库
    	getCusTag();
    	//初始化数组中删除指定元素的函数
    	Array.prototype.removeByValue = function(val) {
	   		for(var i=0; i<this.length; i++) {
	   		   if(this[i] == val) {
	   		     this.splice(i, 1);
	   		     break;
	   		   }
	   		}
   		}
    })
    //清空查询条件
    function clearFrom(){
    	$("#typeId").val("");
    	$("#tagName").val("");
    }
    
    //查询客户标签库
    function getCusTag(){
    	var params = {
    		"typeId": $("#typeId").val(),
            "tagName": $("#tagName").val(),
            "projectQuestionId": parent.projectQuestionId,
            "notIncluded": JSON.stringify(parent.cusTagIds), //获取父级页面中已有的问题
            "pageNum": $("#pageNum").val(),
            "pageSize": $("#pageSize").val(),
            "customerId": "${customerId}"
    	};
    	JY.Ajax.doRequest(null, jypath +'/customer/projectQuestion/queryCusTag', params, function(data){
            $("#baseDiv").empty();
            var page = data.obj;
            //数据集合
            var results = page.rows;
            //分页数据
            var pageNum = page.pageNumber, pageSize = page.pageSize, totalRecord = page.total;
            if(results != null && results.length > 0){
            	var html = "";
                for(var i = 0; i < results.length; i++){
                	var info = results[i];
                	html +='<div class="modal-list-item">'
                	     + '<input type="checkbox" name="tagId" value="' +info.id+ '">'
	                	 + '<span>' +info.question+ '</span>'
	                	 + '</div>';
                }
                $("#baseDiv").append(html);
                JY.Page.setSimPage("baseForm","pageing",pageSize,pageNum,totalRecord,"getCusTag");
                //初始化checkbox事件,并将临时存储的标签展示到对应checkbox
                setTagId();
            }else{
                //隐藏分页
                $("#pageing ul").empty();
            }
		});
    }
    
    //保存选中的客户标签ID
    var cusTagIds = [];
    //临时保存标签ID
    function setTagId(){
        //判断checkbox是否被选中，并执行相应的增加/删除数字元素的方法
        $("input[name='tagId']").on("click",function(){
            if($(this).is(':checked')){
            	cusTagIds.push($(this).attr("value"));
            }else{
            	cusTagIds.removeByValue($(this).attr("value"));
            }
        });
        //将临时存储的标签展示到对应checkbox
        for(var i = 0; i < cusTagIds.length; i++){
            $("input[name='tagId']").each(function(){
                if(cusTagIds[i] == $(this).attr("value")){
                    $(this).attr("checked", true);
                }
            });
        }
    }
    //清空选项
    function clearCusTagId(){
    	//清空数字
    	cusTagIds.splice(0, cusTagIds.length);
    	//将已选择的checkbox修改为未选中
    	$("input[name='tagId']").each(function(){
    		$(this).attr("checked", false);
    	});
    }
    //保存标签ID，并调用父页面查询方法
    function saveTagId(){
    	if(cusTagIds.length == 0){
    		layer.msg("请先选择标签问题");
    		return false;
    	}
    	//调用父页面方法查询标签问题
    	parent.getCusTagList(cusTagIds);
    	//关闭标签库窗口
    	winClose();
    }
    //关闭标签库窗口
    function winClose(){
    	parent.layer.close(index);
    }
    
    //解决选中input框按回车时会刷新页面的问题
    function ClearSubmit(e) {
        if (e.keyCode == 13) {
            return false;
        }
    }
</script>
</html>